<template>
<!--component/fangyiTools/fangyiTools.wxml-->
<!-- 防疫工具箱 -->
<view class="fangyi-tools">
  <view class="tit">
    防疫工具箱
  </view>
  <view class="tools-content">
    <view v-for="(item, index) in toolArr" :key="index" class="single-box" :data-index="index" :data-path="item.href" :data-appid="item.appid" @tap="toTool" :data-title="item.name">
      <image :src="item.img"></image>
      <view class="name">
        {{item.name}}
      </view>
    </view>
  </view>
</view>
</template>

<script>
// component/fangyiTools/fangyiTools.js
import util from "../../utils/util";

export default {
  data() {
    return {
      citycode: 'sz',
      toolArr: []
    };
  },

  components: {},
  props: {},
  beforeMount: function () {// this.getTools()
  },
  destroyed: function () {// 在组件实例被从页面节点树移除时执行
  },
  methods: {
    // 获取工具箱
    getTools(cityCode) {
      util.request('zhuanti.php', {
        action: "geli_tools",
        citycode: cityCode || this.cityCode,
        platform: "wx"
      }, "POST").then(e => {
        this.setData({
          toolArr: e.data.data
        });
      });
    },

    // 前往工具箱详情
    toTool(e) {
      let path = e.currentTarget.dataset.path;
      let linkname = e.currentTarget.dataset.title;
      let appid = e.currentTarget.dataset.appid || '';

      if (path) {
        if (path.indexOf("pages") == -1 && path.indexOf("mp.weixin.qq.com") == -1 && !appid) {
          util.navContact(linkname, path);
        } else {
          util.navMethod(path, appid);
        }
      } else {
        uni.showToast({
          title: '还没有这个入口哦~',
          icon: 'none'
        });
      }
    }

  }
};
</script>
<style>
/* component/fangyiTools/fangyiTools.wxss */
/* 防疫工具箱 */
.fangyi-tools {
  margin: 0 auto;
  box-sizing: border-box;
  padding: 42rpx 0 20rpx 43rpx;
  width: 702rpx;
  background: #ffffff;
  border-radius: 22rpx;
}

.fangyi-tools .tools-content {
  display: flex;
  flex-wrap: wrap;
  margin-top: 30rpx;
}

.fangyi-tools .tools-content .single-box {
  width: 147rpx;
  margin-right: 14rpx;
  margin-bottom: 26rpx;
  text-align: center;
}

.fangyi-tools .tools-content .single-box:nth-child(4n) {
  margin-right: 0;
}

.fangyi-tools .tools-content .single-box image {
  width: 102rpx;
  height: 102rpx;
  margin-bottom: 11rpx;
}

.fangyi-tools .tools-content .single-box .name {
  line-height: 23rpx;
  font-size: 24rpx;
  font-family: PingFang SC Medium, PingFang SC Medium-Medium;
  font-weight: 500;
  text-align: center;
  color: #000000;
}
.tit{
  font-weight: bold;
}
</style>